import './assets/main.css'
import { createApp } from 'vue'
//添加pinia
import { createPinia } from 'pinia'
import { createPersistedState } from 'pinia-plugin-persistedstate'

const pinia = createPinia()

pinia.use(
  createPersistedState({
    storage: sessionStorage,
  }),
)

//快速开始
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import App from './App.vue'
import zhCn from 'element-plus/es/locale/lang/zh-cn'
import axios from 'axios'
import router from './router'

import * as ElementPlusIconsVue from '@element-plus/icons-vue'
// 持久化
import piniaPersistedState from 'pinia-plugin-persistedstate'

// 定义一个函数用于设置Authorization头信息，方便在其他地方根据实际情况调用
const setAuthorizationHeader = (token: string | null) => {
  if (token) {
    axios.defaults.headers.common['Authorization'] = `Bearer ${token}`
  } else {
    // 如果token不存在或者过期等情况，可选择清除之前设置的头信息
    delete axios.defaults.headers.common['Authorization']
  }
}

// 可以在合适的地方（比如页面初始化等情况）先尝试获取本地存储的token并设置头信息
const token = window.localStorage.getItem('token')
setAuthorizationHeader(token)

const app = createApp(App)

// 使用持久化插件
pinia.use(piniaPersistedState)
app.use(createPinia())
// 应用ElementPlus插件并配置语言为中文
app.use(ElementPlus, {
  locale: zhCn,
})
// 全局注册ElementPlus图标组件
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}

// 应用Pinia插件以及持久化插件
app.use(createPinia().use(piniaPersistedState))

//国际化

app.use(ElementPlus, {
  locale: zhCn,
})

app.use(router)
app.use(pinia)
app.mount('#app')
